<template>
  <ShowContentVue
      :textContent="TextContent"
      @btnEvent="register"
      @textEvent="toLogin"
      :userFormData="form"
  />
</template>

<script setup>
import ShowContentVue from '../../components/ShowContent.vue';
import {
  useUserStore
} from '../../store'
import {
  ref,
  reactive
} from 'vue';

const TextContent = reactive({
  btnText: '立即注册',
  text: '已有账号？去登录',
  welcome: '您好,一键注册!',
  placeHolderText: {
    fText: '账号',
    sText: '密码',
    isShowCode: true
  },
  placeHolderStyle: {
    color: '#FB7685',
    paddingRight: '48rpx'
  }
})
const userStore = useUserStore()
const form = reactive({
  password: "",
  phone: ""
})
const register = async ({checkedAgree}) => {
  if (!checkedAgree.value) {
    uni.showToast({
      title: '请选择同意协议'
    })
    return
  }
  if (form.password === "" || form.phone === "") {
    uni.showToast({
      title: '用户名密码为空'
    })
    return
  }
  const res = await userStore.userRegister({
    ...form
  })
  if (res?.code == 0 || res?.code == "10016") {
    uni.showToast({
      title: res?.code == 0 ? "注册成功" : res?.message || '已有账号,去登陆',
      duration: 2000,
    })
    setTimeout(function () {
      uni.hideToast();
      uni.navigateTo({
        url: "/pages/login/index"
      })
    }, 2000);
  } else if (res?.code === '-1') {
    uni.showToast({
      message: res?.message,
    })
  }
}

//注册
const toLogin = () => {
  console.log('注册');
  uni.navigateTo({
    url: "/pages/login/index"
  })
}
</script>

<style scoped lang="scss">
::v-deep .u-input__content__field-wrapper__field {
  padding: 10rpx 0 10rpx 30rpx;
  color: #CCCCCC;
}
</style>